//页面加载完成执行里面的代码
$(function () {
    getCode();


    // 加载layui模板,第一个参数是模板名称,第二个参数是类的方法
    // JavaScript里面不区分单双引号
    layui.use('form', function () {
        // 变量定义：int a=11;
        // let 定义变量  const 定义常量
        let form = layui.form;

        // {
        //     // js的数据类型：字符，数字，布尔，对象，数组
        //     let str = "aaa", char = 'aaaa';
        //     let num = 1231;
        //     const numa = 1231;
        //     // num=2342;
        //     // numa=432;
        //     let boo = true;
        //     let obj = {name: 'aa', age: 11};
        //     let arr = [1, 2, "aa", {}, []];
        //     console.log(typeof num)
        //     console.log(typeof obj)
        //     console.log(typeof arr)
        //     console.log(typeof str)
        // }
        // layer.msg('玩命卖萌中', function () {
        //     //关闭后的操作
        // });
        // function 表示Java的方法，就说里面要执行的代码
//自定义验证规则
        form.verify({
            username: [/^[a-zA-Z0-9_-]{4,16}$/, "4到16位（字母，数字，下划线，减号）"],
            pass: [/(.+){6,12}$/, '密码必须6到12位'],
            repass: function (value) {
                if ($('#L_pass').val() != $('#L_repass').val()) {
                    return '两次密码不一致';
                }
            },
            code: [/^\w{4}$/, '验证码格式错误，请重新输入']
        });

        //监听提交,事件
        form.on('submit(login)', function (data) {
            data = data.field;//对变量重新赋值
            // alert(888)
            // console.log(data)
            // console.log(data.field)
            // console.log(JSON.stringify(data.field))
            // layer.msg(JSON.stringify(data.field), function () {
            //     //跳转页面
            //     location.href = 'index.html'
            // });
            // let username=data.field.username;
            // let password=data.field.password;
            // console.log(username)
            // 什么时候跳转到新页面,应该登录成功才能跳转新页面
            // 要登陆之前需要判断用户输入格式是否正确
            // 调用Java后台：
            // ajax 调用
            $.ajax({
                url: '/login',//对于Java后台的注解地址
                data: data,//要传递给Java后台的指
                type: 'post',//对应Java后台的方法
                dataType: 'json',//固定
                success: function (res) {//res是Java后台传递给前端的指
                    console.log(res);
                    if (res.msg == 'error') {
                        layer.msg('用户名或者密码不匹配，请重新输入', {icon: 2, time: 2000});
                    } else if (res.msg == 'success') {
                        layer.msg('恭喜你登录成功', function () {
                            //关闭后的操作
                            sessionStorage.setItem("username",data.username)
                            location.href = '/html/index.html'
                        });

                    } else {
                        layer.msg('验证码输入不正确，请重新输入', {icon: 2, time: 2000});
                    }
                }
            });
            // 不让刷新页面：正常情况下，点击submit按钮回刷新页面
            return false;
        });
    });
})

function getCode() {
    $.ajax({
        url: "/code",
        type: "get",
        dataType: "json",
        success: function (res) {
            // $("#id").load("top.html");
            $("#codeImg").attr("src", res.msg);
        }
    })
}